<include file="App/Home/View/Public/header.html"/>
<!--top end-->

<script src="/Public/js/jquery.form.js"></script>

<style>
    .uploadify-button {text-align:center;}
	.apply select option {
    height: 20px;
}
#account-main .account-content .account-right {
    background-color: #fff;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    min-height: 895px;
}

.content-head {
    line-height: 55px;
    font-size: 18px;
    color: #000;
}
#apply label{
    font-weight: 500;
}
#apply li{
    color: #333;
    
}
.input-wrap {
    margin-left: 15px;
    min-height: 44px;
    width: 320px;
    vertical-align: middle;
    line-height: 25px;
    border: 1px solid #ddd;
    padding: 5px;
    border-radius: 4px;
}
.area, .city{
    border: 1px solid #ddd;
     padding: 5px;
    border-radius: 4px;
     margin-left: 15px;
}
.note{
    color: red;
}
.btn-wrap,.a-upload {
    margin-top: 10px;
    width: 90px;
    height: 40px;
    background-color: #008fff;
    color: #fff;
    border-radius: 3px;
}
.textareaText{
     border-radius: 3px;
     border: 1px solid #ddd;
}
.fileField{
    /*opacity: 0;*/
}
/*.file {
   
   
    padding: 9px 17px;
    
}
.file input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
}
.file:hover {
    background: #AADFFD;
    border-color: #78C3F3;
    color: #004974;
    text-decoration: none;
}*/
.a-upload {
    
    position: relative;
    cursor: pointer;
    padding: 3px 17px;
   
    overflow: hidden;
    display: inline-block;
    *display: inline;
    *zoom: 1
}

.a-upload  input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer
}

.a-upload:hover {
    color: #000;
    background: #0662ab;
    border-color: #ccc;
    text-decoration: none
}
.showFileName{
    color: red;
    position: relative;
    bottom: 15px;
    left: 5px;
}
</style>
<script>
    $(document).ready(function(){
        start=document.cookie.indexOf("motip=")
        if (start!=-1){
            start=start + 6
            end=start + 1
            motip = unescape(document.cookie.substring(start,end))
            if(motip == 1)
                $('#phone_top_div').show();
        }
    });
    function hidephone(){
        $('#phone_top_div').hide();
        var d=new Date()
        d.setTime(d.getTime() + 7200)
        document.cookie="motip=2;expires="+d.toUTCString()
    }
</script>

<div id="account-main" role="main">
    <div class="container account-content">
        <div class="row">
            <include file="App/Home/View/Public/left.html"/>
            <div class="col-xs-9 account-right">
            <div class="raise right clearfix">
                <h2 style="border-bottom:1px solid #e1e1df;" class="content-head">修改账户信息</h2>
                <form method="post" id="signupForm" action="{:U('User/updateMassage')}" jump-url="{:U('User/updateMassage')}" >
                    <ul class="apply" id="apply">
                        <li style="margin-bottom:0px;"><label class="youxiang">用户ID： </label>{$list['member_id']}</li>
                        <li style="margin-bottom:10px;"><label for="email" class="youxiang">用户名：</label>{$list['email']}</li>
                        <li style="margin-bottom:10px;"><label for="job" class="youxiang">昵称：</label>
                            <input type="text" name="nick" id="nick" class="input-wrap" value="{$list['nick']}">
                            <span class="note" id="nickmsg">请填写昵称，会优先显示</span>
                        </li>
                        <li style="margin-bottom:10px;"><label for="realname" class="youxiang">真实姓名：</label>{$list['name']|mb_substr=0,1,"utf-8"}*<span class="note">（如需修改姓名，请联系客服人员）</span></li>
                        <li style="margin-bottom:15px;"><label for="idcard" class="youxiang">身份证号：</label>{$list['idcard']|substr=0,3}****{$list['idcard']|substr=15,3}<span class="note">（如需修改证件号，请联系客服人员）</span></li>
                        <li style="margin-bottom:10px;"><label for="mo" class="youxiang"><span class="redstar"></span>手机号：</label>
                            {$list['phone']|substr=0,3}****{$list['phone']|substr=9,2}<span class="note" id="momsg"><!--<a class="voices" href="/user_phone/update">修改手机号码</a>--></span><div class="clear"></div>
                        </li>
                        <li><label>所在城市：</label>
                            <select name="province" class="area" id="area">
                                <option value="0">请选择</option>
                                <volist name="areas" id='row'>
                                    <option value="{$row['area_id']}" <eq name="row.area_id" value="$list.province">selected="selected"</eq>>{$row['area_name']}
                                    </option>
                                </volist>
                            </select>
                            <select name="city" class="city" id="city">
                                <option value="{$list['city']}">{$list['area_name_city']}</option>
                            </select>
                            <script>
                                $("#area").change(function(){
                                    $.post("{:U('User/getcity')}",{'id':$("#area").val()},function(data){
                                        $("#city").empty();
                                        var area=new Option("请选择","");
                                        $("#city").append(area);
                                        if(data.length>0){
                                            for(var i=0;i<data.length;i++){
                                                var option = new Option(data[i]["area_name"], data[i]["area_id"]);
                                                $("#city").append(option);
                                            }
                                        }else{
                                            $("#city").append("<option value='0'>没有相应城市信息</option>");
                                        }
                                    });
                                });
                            </script>
                            <span class="note" id="promsg"></span>
                        </li>
                        <li><label for="job" class="youxiang">职位/头衔：</label>
                            <input type="text" name="job" id="job" class="input-wrap" value="{$list['job']}">
                        </li>
                        <li style="margin-bottom:20px;">

                            <label for="upload">上传头像：</label></br>
                            <a href="javascript:;" class="a-upload">选择文件<input type="file" size="45" id="file_upload1" name="file_upload1" class="fileField left" style="text-align:center;" /></a><span class="showFileName">未上传文件</span><span class="fileerrorTip"></span></br>
                            <button type="button" class="button left upload btn btn-wrap" id="upl" >上传</button>
                            <span class="note left" style="height:40px; line-height:20px;">尺寸需大于120*120像素；支持.jpg .png .gif格式；小于1MB的图片</span>
                            <div id="fileQueue1"></div>
                            <div class="clear"></div>
                        </li>
                        <!--                <li style="margin-bottom:10px;"><label>&nbsp;</label><img src="--><!--" id="logo" style="width:72px; height:72px;"/></li>-->
                         <li style="margin-bottom:10px;"><label>&nbsp;</label>
                            <img name="head"
                            <if condition="$list['head']">src="{$list['head']}"
                                <else/>src="__PUBLIC__/Home/images/ulogodefault.jpg"
                            </if>
                            id="logo" style="width:72px; height:72px;"></li>

                        <input type="hidden" name="head" id="head_hidden"
                        <if condition="$list['head']">value="{$list['head']}"
                            <else/>value="__PUBLIC__/Home/images/ulogodefault.jpg"
                        </if>
                        > 
    					<!-- ajax上传头像 -->
    					<!-- <li style="margin-bottom:10px;"><label for="jianjie">头像上传</label> -->
    					<!-- <form action="{:U('User/addPicForAjax')}" id="uploadForm" method="post" enctype="multipart/form-data"> -->
    						<!-- <input type="file"   id="head" name="pic" /> -->
    						
    					<!-- </form>   -->
    					
    					<!-- </li> -->
    					
    					<!-- <script src="/Public/js/jquery-1.4.2.min.js"></script> -->
    					<script type="text/javascript">
    						$(document).ready(function(){
    							$('#upl').click(function(){
    							
    							 $('#file_upload1').wrap("<form id='ajaxupload' action='{:U('User/addPicForAjax')}' method='POST' enctype='multipart/form-data'></form>");
    								$("#ajaxupload").ajaxSubmit({
    									dataType:'text',
    									success:function(data){
    										//alert(123);
    										//alert(data);
    										
    										 //var r=jQuery.parseJSON(data);
    										$("#pic1").val(data['info']);
    										//$("#uploadedpic").empty();
    										$("#logo").attr("src",data['info']);
    										$("#head_hidden").attr("value",data['info']);
    										//$(".uploadedpic").append("<img src='"+r['info']+"' class='mt10'>");
    										
    										
    										$('#file_upload1').unwrap();
    										
    									},
    									error:function(data){
    										 data = $.parseJSON(data.replace(/<.*?>/ig,""));
    										//console.log(data);
    										//alert(data.info);
    										$("#pic1").val(data['info']);
    										//$("#uploadedpic").empty();
    										$("#logo").attr("src",data['info']);
    										$("#head_hidden").attr("value",data['info']);
    										//$(".uploadedpic").append("<img src='"+r['info']+"' class='mt10'>");
    										
    										
    										$('#file_upload1').unwrap();
    									}
    								});
    								
    							});
    							
    							});
    						
    					
    					
    					
    					
    					
    					
    					</script>
    					
    					
    					
                        <li style="margin-bottom:10px;"><label for="jianjie">个人简介：</label>
                            <textarea id="jianjie" rows="5" cols="60" name="profile" class="textareaText">{$list['profile']}</textarea>
                            <span class="note" style=" margin-left:110px;">3000字以内</span>
                        </li>
                        <input type="hidden" name="member_id" value="{$list['member_id']}"/>
                        <li><label class="youxiang">&nbsp;</label><input type="submit" class="queding btn btn-wrap" value="确定"></li>
                    </ul>
                </form>
            </div>
            </div>
        </div>
        <div class="clear"></div>
    </div>
</div>
<link href="__PUBLIC__/js/uploadify/uploadify.css">
<script type="text/javascript" src="__PUBLIC__/js/uploadify/jquery.uploadify.min.js"></script>
<script type="text/javascript">
    //$(function () {

        /*$("#file_upload1").uploadify({
            //指定swf文件
            'swf': '/Public/js/uploadify/uploadify.swf',
            //后台处理的页面
            'uploader': "{:U('User/addPicForAjax')}",
            //按钮显示的文字
            'buttonText': '点击上传',
            //显示的高度和宽度，默认 height 30；width 120
            'height': 30,
            'width': 330,
            //上传文件的类型  默认为所有文件    'All Files'  ;  '*.*'
            //在浏览窗口底部的文件类型下拉菜单中显示的文本
            'fileTypeDesc': 'Image Files',
            //允许上传的文件后缀
            'fileTypeExts': '*.gif; *.jpg; *.png',
            //发送给后台的其他参数通过formData指定
            //'formData': { 'someKey': 'someValue', 'someOtherKey': 1 },
            //上传文件页面中，你想要用来作为文件队列的元素的id, 默认为false  自动生成,  不带#
            'queueID': 'fileQueue1',
            //选择文件后自动上传
            'auto': true,
            //设置为true将允许多文件上传
            'multi': false,
            'onUploadSuccess':function(file,data,response){
                var r=jQuery.parseJSON(data);
                $("#pic1").val(r['info']);
                //$("#uploadedpic").empty();
                $("#logo").attr("src",r['info']);
                $("#head_hidden").attr("value",r['info']);
                //$(".uploadedpic").append("<img src='"+r['info']+"' class='mt10'>");
            }
        });
    });*/
</script>

<script>
    $("#signupForm").validate({
        rules: {
        },
        messages: {
        },
        submitHandler:function(form){
            ajax_submit_form(form)
            return false;
        },
        invalidHandler: function() {  //不通过回调
            return false;
        }
    });
</script>
<script>
    $(".menu7").addClass("uc-current");
</script>
<script>
    $("#file_upload1").on("change",function(){
        //alert(1);
    var filePath=$(this).val();
    if(filePath.indexOf("jpg")!=-1 || filePath.indexOf("png")!=-1){
        $(".fileerrorTip").html("").hide();
        var arr=filePath.split('\\');
        var fileName=arr[arr.length-1];
        $(".showFileName").html(fileName);
    }else{
        $(".showFileName").html("");
        $(".fileerrorTip").html("您未上传文件，或者您上传文件类型有误！").show();
        return false 
    }
})
</script>
<include file="App/Home/View/Public/footer.html"/>